<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>登录</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}">
</head>
<body>
    <header th:replace="common::#header"></header>
    <nav th:replace="common::#nav"></nav>
    <article class="container">
        <form class="form-horizontal">
            <div class="form-group">
                <label for="usrAccount" class="col-sm-2 control-label">账号</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="usrAccount" name="account" placeholder="2-16位字符">
                </div>
            </div>
            <div class="form-group">
                <label for="usrPassword" class="col-sm-2 control-label">密码</label>
                <div class="col-sm-10">
                    <input type="password" class="form-control" id="usrPassword" name="password" placeholder="2-16位字符">
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="button" class="btn btn-default" id="submit">登录</button>
                    <span style="color: red;" th:text="${tip}"></span>
                </div>
            </div>
        </form>
    </article>
    <footer th:replace="common::#footer"></footer>

    <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
    <script th:src="@{/js/bootstrap.js}"></script>
    <script th:src="@{/js/layer.js}"></script>
    <script th:src="@{/js/login.js}"></script>

</body>
</html>